<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>Fruit</title>
    <link rel="stylesheet" href="css/login/first_page.css"/>
    <script src="js/jquery.min.js"></script>
    <script>
        function jump1(){
            window.location.href="user_login.html";
        }
        function jump2(){
            window.location.href="about_us.html";
        }
    </script>
</head>
<body>
<div class="container">



    <div class="body">

        <div class="header">
            <div class="left">
                <a href="#" style="font-size: xx-large">
                    <span>Fruit</span>
                    <img class="img1" src="img/login-img/logo-icon.png"  alt="img1">
                    <span class="light-font">福禄德水果</span>
                </a>
                <span>水果商店</span>
            </div>
            <div class="right">
                <a href="#">主页</a>
                <a href="#" onclick="jump2()">关于我们</a>
                <a href="#">商店</a>
                <a href="#">店铺单</a>
                <a href="#">个人信息</a>
                <a href="#">联系我们</a>
                <a href="#" onclick="user_login()">登录</a>
            </div>
        </div>

        <img class="img2" src="img/login-img/first_page.jpg" alt=""/>
        <div class="banner">
            <img src="img/login-img/slide-txt-1.png" alt=""/>
            <p>福禄得水果店</p>
            <!--<button class="shop" onclick="jump1()">欢迎进店</button>-->
            <!--<button class="about" onclick="jump2()">关于我们</button>-->
            <a href="#" class="cta" onclick="jump1()">欢迎进店</a>
        </div>
    </div>

</div>
<script type="text/javascript">

    function user_login() {
        window.location.href = "user_login.html";
    }

    var $cta = $('.cta');

    var createBtnsMarkup = function createBtnsMarkup() {
        $cta.each(function (i, btn) {
            var $t = $(btn);
            var $btnText = $t.text();
            var $splitText = $btnText.split("");

            $t.html("").append("\n\t\t\t\t<span class=\"btn-text-parent\">\n\t\t\t\t\t<span class=\"wrap_text current-btn-text\"></span>\n\t\t\t\t\t<span class=\"wrap_text buildin-btn-text\"></span>\n\t\t\t\t</span>\n\t\t\t");

            for (var _i = 0; _i < $splitText.length; _i++) {
                $t.
                        find(".wrap_text").
                        append("<span class=\"btn-letter\">" + $splitText[_i] + "</span>");
            }
        });
    };


    window.onLoad = createBtnsMarkup();</script>
</body>
</html>